<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>新闻管理</title>
<link rel="stylesheet" href="resource/css/layui.css">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="format-detection" content="telephone=no" />
<link rel="stylesheet" href="css/font-awesome/css/font-awesome.min.css">
</head>
<body>
	<fieldset class="layui-elem-field">
		<legend>产品添加</legend>
		<div class="layui-field-box layui-form">
			<form class="layui-form" style="margin: 15px;">
				<input type="hidden" th:field="${news.id}"> <input
					type="hidden" th:field="${news.createUserId}"> <input
					type="hidden" th:field="${news.deleteFlag}">
					
				<div class="layui-form-item" style="width: 20%">
					<label class="layui-form-label">新闻图片</label>
			 			 <div class="layui-inline layui-upload" data-id="2">
							<button type="button" class="layui-btn" id="test">点击上传</button>
							  	<input type="hidden" th:field="${news.img}" name="img"  id="img" />
							    <img class="layui-upload-img"  th:src="${news.img}" id="demo" style="width:70%">
							    <p id="demoText"></p>
						</div>
				</div>
				<div class="layui-form-item">
					<label class="layui-form-label">新闻标题</label>
					<div class="layui-input-block">
						<input type="text" th:field="${news.title}" lay-verify="name"
							lay-verType="tips" placeholder="请输入新闻标题" autocomplete="off"
							class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<label class="layui-form-label">新闻内容简介</label>
					<div class="layui-inline" id="editor1" th:utext="${news.context}">
					
					</div>
				</div>

				<div class="layui-form-item">
					<div class="layui-input-block">
						<button class="layui-btn" lay-submit lay-filter="edit">立即提交</button>
						<button type="reset" class="layui-btn layui-btn-primary">重置</button>
					</div>
				</div>
			</form>
		</div>
	</fieldset>



	<script src="resource/layui.js"></script>
	<script src="js/news_edit.js"></script>

	<script type="text/javascript" src="js/wangEditor.js"></script>
	<script type="text/javascript">
		var E = window.wangEditor
		var editor = new E('#editor1')
		editor.customConfig.uploadFileName = 'myFileName'
		editor.customConfig.uploadImgServer = '/loans/upload'
		editor.customConfig.uploadImgTimeout = 30000
		
		editor.customConfig.uploadImgHooks = {
			    before: function (xhr, editor, files) {
			        console.log('before');
			    },
			    success: function (xhr, editor, result) {
			    	console.log('success');
			        // 图片上传并返回结果，图片插入成功之后触发
			        // xhr 是 XMLHttpRequst 对象，editor 是编辑器对象，result 是服务器端返回的结果
			    },
			    fail: function (xhr, editor, result) {
			    	console.log('fail');
			        // 图片上传并返回结果，但图片插入错误时触发
			        // xhr 是 XMLHttpRequst 对象，editor 是编辑器对象，result 是服务器端返回的结果
			    },
			    error: function (xhr, editor) {
			    	console.log('error');
			        // 图片上传出错时触发
			        // xhr 是 XMLHttpRequst 对象，editor 是编辑器对象
			    },
			    timeout: function (xhr, editor) {
			        // 图片上传超时时触发
			        // xhr 是 XMLHttpRequst 对象，editor 是编辑器对象
			    },
	
			    // 如果服务器端返回的不是 {errno:0, data: [...]} 这种格式，可使用该配置
			    // （但是，服务器端返回的必须是一个 JSON 格式字符串！！！否则会报错）
			    customInsert: function (insertImg, result, editor) {
			        var data = result.data
			        insertImg(data)
			        // result 必须是一个 JSON 格式字符串！！！否则报错
			    }
		}
	
		editor.create()	
	
	
		layui.use('upload', function(){
			  var $ = layui.jquery
			  ,upload = layui.upload;
		  
				 var uploadInst = upload.render({
					    elem: $("#test")
					    ,url: 'http://47.97.126.57:8082/formpostmultipar'
					    ,before: function(obj){
					      //预读本地文件示例，不支持ie8
					      obj.preview(function(index, file, result){
					        $("#demo").attr('src', result); //图片链接（base64）
					      
					      });
					    }
					    ,done: function(res){

					      //如果上传失败
					      if(res.code > 0){
					        return layer.msg('上传失败');
					      }
					      //上传成功
					      $("#img").val(res.data.src)

						  console.log(res);
					    }
					    ,error: function(){
//					    	console.log("asdas");
					      //演示失败状态，并实现重传
					      var demoText = $("#demoText");
					      demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
					      demoText.find('.demo-reload').on('click', function(){
					        uploadInst.upload();
					      });
					    }
					  });
			})
	
		
	</script>
</body>
</html>